<template>
	<view>
		<view class="navTive" v-show="!orderlist.length > 0">
		      <image src="../../../static/home/zhanwu.png" mode=""></image>
			  <view>暂无订单</view>
		</view>
		<view class="neworders" v-for="(item, index) in orderlist" :key="index">
			<!-- 等待接单 -->
			<view class="new f_two">
				<view class="f">
					<view>#</view>
					<view>{{ item.takeNo }}</view>
					<view>预计 {{ item.serviceAt }} 送达</view>
				</view>
				<view>等待接单</view>
			</view>
			<view class="vImg"><image src="../../../static/home/xian.png" mode=""></image></view>

			<!-- 2 -->
			<view class="header">
				<view class="nav f_two">
					<view>{{ item.realName == '' ? item.userName : item.realName }}</view>
					<view>
						<image src="../../../static/home/dingwei.png" mode=""></image>
						<image @tap="gophone" src="../../../static/home/dianhua.png" mode=""></image>
					</view>
				</view>
				<!-- 超级会员 -->
				<view class="f">
					超级会员 · 近180天第5次下单 ·
					<text>用户上次评价</text>
				</view>

				<view>东平南路森林公园[10.31km]</view>
				<!-- 分割线 -->
				<view class="divider"></view>
				<!-- 1件商品 -->
				<view>{{ item.num }}件商品</view>
				<!-- 备注：4份餐具 -->
				<view>
					<view>
						备注：
						<text>4份餐具</text>
					</view>
				</view>
				<view class="divider"></view>
				<!-- 青椒肉丝 -->
				<view v-for="(v, i) in item.goodsArr" :key="i">
					<view>{{ v.name }}</view>
					<view>x {{ v.num }}</view>
					<view>{{ v.money }}</view>
				</view>
				<view class="divider"></view>
				<view>其他</view>
				<!-- 配送费 -->
				<view v-for="(v, i) in item.goodsArr" :key="i">
					<view>配送费</view>
					<view>{{ item.boxMoney }}</view>
				</view>
				<view class="divider"></view>
				<view class="divider_one">顾客实付 ￥{{ item.money }}</view>
			</view>

			<!-- 拒单 -->

			<view class="single">
				<!-- 本单预计收入 -->
				<view class="sheet">
					<view>本单预计收入</view>
					<image src="../../../static/home/yiwen.png" mode=""></image>
					<view></view>
					<view>￥{{ item.storeActualMoney }}</view>
				</view>
				<view>
					<view>拒单</view>
					<view>
						接单

						<text v-if="Time.autoRefuse == '0'">1</text>
						<text v-else>{{ toLiveBtn }}</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
export default {
	props: ['orderlist', 'Time'],

	name: 'neworders',
	data() {
		return {
			toLiveBtn:""
		};
	},
	mounted() {
		console.log(this.Time, 877111111);
		if(this.orderlist.length > 0){
			this.countdown();
		}
		
	},
	methods: {
		gophone() {
			uni.makePhoneCall({
				// 手机号
				phoneNumber: this.orderlist[0].receivedTel,

				// 成功回调
				success: res => {
					console.log('调用成功!');
				},

				// 失败回调
				fail: res => {
					console.log('调用失败!');
				}
			});
		},

		// 倒计时
		countdown() {
			const that = this;
			that._interval = setInterval(() => {
				if (that.Time.refuseTime == 0) {
					// 计时结束，清除缓存
					clearInterval(that._interval);
				} else {
					that.Time.refuseTime--;
					let min = parseInt((that.Time.refuseTime / 60) % 60);
					let sec = parseInt(that.Time.refuseTime % 60);
					min = min > 9 ? min : '0' + min;
					sec = sec > 9 ? sec : '0' + sec;
					that.toLiveBtn = `${min}分${sec}秒`;
					console.log(that.toLiveBtn,8111111)
				}
			}, 1000);
		}
	}
};
</script>
<style lang="scss" scoped>
.navTive {
	image{
		width: 329upx;
		height: 216upx;
		margin: 0upx auto;
		display: flex;
		padding-top: 177upx;
	}
	&>view:nth-child(2){
		
		font-size: 30upx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #BCBCBC;
		text-align: center;
		margin-top: 65upx;
	}
}
.neworders {
	height: 64vh;
	overflow-y: auto;
	margin: 20upx auto;
	background: $bg1-color;
	box-shadow: 0upx 0upx 15upx 1upx rgba(102, 102, 102, 0.16);

	.new {
		background: $bg1-color;
		& > view:nth-child(1) {
			margin-top: 49upx;
			& > view:nth-child(1) {
				font-size: 26upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: $bg2-color;
				margin-left: 46upx;
			}
			& > view:nth-child(2) {
				font-size: 56upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: $bg2-color;
				margin-left: 12upx;
			}
			& > view:nth-child(3) {
				font-size: 30upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: $bg4-color;
				margin-left: 27upx;
			}
		}
		& > view:nth-child(2) {
			font-size: 30upx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: $bg2-color;
			margin-top: 57upx;
			margin-right: 30upx;
		}
	}
	.vImg {
		background: $bg1-color;
		image {
			width: 100%;
			height: 6upx;
		}
	}
	.header {
		padding: 98upx 46upx 0upx 43upx;
		background: $bg1-color;
		padding-bottom: 200upx;
		overflow-y: auto;

		.nav {
			width: 100%;
			& > view:nth-child(1) {
				font-size: 35upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: $bg2-color;
			}
			& > view:nth-child(2) {
				& > image:nth-child(1) {
					width: 30upx;
					height: 33upx;
					margin-right: 40upx;
				}
				& > image:nth-child(2) {
					width: 33upx;
					height: 33upx;
				}
			}
		}
		// 超级会员
		& > view:nth-child(2) {
			font-size: 26upx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: $bg5-color;
			margin-top: 48upx;
			text {
				color: $bg-color;
			}
		}
		& > view:nth-child(3) {
			font-size: 26upx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: $bg6-color;
			margin-top: 23upx;
		}
		.divider {
			width: 100%;
			height: 1upx;
			background: $bg1-background;
			margin-top: 47upx;
		}
		& > view:nth-child(5) {
			font-size: 35upx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: $bg2-color;
			margin-top: 48upx;
		}
		& > view:nth-child(6) {
			margin-top: 56upx;
			& > view {
				font-size: 26upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: $bg-color;
				& > text {
					color: $bg6-color;
				}
			}
		}
		& > view:nth-child(8) {
			display: flex;
			margin-top: 48upx;
			& > view:nth-child(1) {
				font-size: 30upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: $bg2-color;
				flex: 4;
			}
			& > view:nth-child(2) {
				font-size: 30upx;
				font-family: Source Han Sans CN;
				font-weight: bold;
				color: $bg6-color;
				flex: 2;
			}
			& > view:nth-child(3) {
				font-size: 30upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: $bg2-color;
				flex: 1;
				text-align: right;
			}
		}
		& > view:nth-child(10) {
			font-size: 28upx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: $bg5-color;
			margin-top: 48upx;
		}
		& > view:nth-child(11) {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 32upx;
			& > view:nth-child(1) {
				font-size: 30upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: $bg6-color;
			}
			& > view:nth-child(2) {
				font-size: 30upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: $bg2-color;
			}
		}
	}

	.single {
		margin-top: 22upx;
		z-index: 1;
		position: fixed;
		bottom: var(--window-bottom);
		left: 0;
		right: 0;
		background: $bg5-background;
		width: 93%;
		margin: 0 auto;

		.sheet {
			display: flex;
			align-items: center;
			text-align: right;
			justify-content: flex-end;
			padding: 0 43upx;
			background: $bg1-color;
			height: 125upx;
			border-top: 1upx solid $bg6-background;
			box-shadow: 0upx 0upx 15upx 1upx rgba(102, 102, 102, 0.16);
			& > view:nth-child(1) {
				font-size: 30upx;
				font-family: Source Han Sans CN;
				font-weight: bold;
				color: $bg2-color;
			}
			image {
				width: 30upx;
				height: 30upx;
				margin-left: 15upx;
			}
			& > view:nth-child(3) {
				// width:70upx;
				height: 30upx;
				background: $bg3-background;
				font-size: 22upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: $bg1-color;
				margin-left: 46upx;
			}
			& > view:nth-child(4) {
				font-size: 30upx;
				font-family: Source Han Sans CN;
				font-weight: bold;
				color: $bg-color;
				margin-left: 24upx;
			}
		}
		& > view:nth-child(2) {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 22upx;
			padding-bottom: 20upx;
			& > view:nth-child(1) {
				width: 30%;
				height: 92upx;
				background: $bg7-background;
				border-radius: 10upx;

				font-size: 34upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: $bg6-color;

				display: flex;
				align-items: center;
				justify-content: center;
				box-shadow: 0upx 0upx 15upx 1upx rgba(102, 102, 102, 0.16);
			}
			& > view:nth-child(2) {
				width: 66%;
				height: 92upx;
				background: $bg-background;
				border-radius: 10upx;
				font-size: 34upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: $bg1-color;

				display: flex;
				align-items: center;
				justify-content: center;
				box-shadow: 0upx 0upx 15upx 1upx rgba(102, 102, 102, 0.16);
				& > text {
					font-size: 30upx;
				}
			}
		}
	}
	// 客户实付
	.divider_one {
		margin-top: 48upx;
		font-size: 32upx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #333333;
		text-align: right;
		padding-bottom: 60upx;
	}
}
</style>
